Frontend/src/components/SponsorshipModal/SponsorshipModal.tsx (3)

19-34: Add defensive check before restoring focus.

Line 33 attempts to restore focus to prevActive without verifying that the element still exists in the DOM or is focusable. If the element was removed while the modal was open, calling focus() could fail silently or throw an error.

Apply this diff to add a defensive check:

     return () => {
       window.removeEventListener("keydown", onKey);
-      prevActive?.focus();
+      if (prevActive && document.contains(prevActive)) {
+        prevActive.focus();
+      }
     };

---

167-179: Simplify mailto link handling.

Opening a mailto: URL with window.open(mailto, "_blank") is unnecessary and may be blocked by popup blockers. The mailto: protocol doesn't open a new page; it launches the user's email client directly.

Apply this diff to simplify:

             <button
               onClick={() => {
-                // example contact behaviour: open mailto (safe)
                 const mailto = `mailto:[email protected]?subject=Interested in ${encodeURIComponent(
                   t.title || "campaign"
                 )}`;
-                const win = window.open(mailto, "_blank");
-                if (!win) window.location.href = mailto;
+                window.location.href = mailto;
               }}
               className="px-4 py-2 bg-indigo-600 text-white rounded-lg shadow"
             >

---

18-35: Consider implementing a focus trap.

The current focus management focuses the modal container on open but doesn't prevent users from tabbing out to background content. This violates modal accessibility best practices, as focus should remain trapped within the modal.

Consider using a library like focus-trap-react or implementing a custom focus trap that cycles focus back to the first focusable element when the user tabs past the last element (and vice versa).

Example with focus-trap-react:

import FocusTrap from 'focus-trap-react';

// Wrap modal content:
<FocusTrap>
  <div ref={dialogRef} tabIndex={-1} className="...">
    {/* modal content */}
  </div>
</FocusTrap>

Frontend/src/main.tsx (2)

4-4: Use English for code comments.

The comment contains non-English text (Hindi/Hinglish). For maintainability in an international codebase, all comments should be in English.

Apply this diff:

-import "./index.css"; // agar file nahi hai to hata sakte ho (nahin to leave it)
+import "./index.css"; // can be removed if file doesn't exist

---

44-45: Root element fallback may cause issues.

Creating and appending a root element to document.body if the #root element doesn't exist could lead to unexpected rendering behavior and makes debugging harder. It's better to fail fast with a clear error if the expected DOM structure is missing.

Apply this diff:

-const rootEl = document.getElementById("root") || document.body.appendChild(document.createElement("div"));
-createRoot(rootEl as HTMLElement).render(<TestApp />);
+const rootEl = document.getElementById("root");
+if (!rootEl) {
+  throw new Error("Root element not found. Ensure index.html contains <div id='root'></div>");
+}
+createRoot(rootEl).render(<TestApp />);

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Frontend/src/components/SponsorshipModal/SponsorshipModal.tsx (1)

123-123: Remove trailing whitespace.

Line 123 contains unnecessary whitespace/empty line within the button element.

Apply this diff:

               >
                 {tt.label}
-              
               </button>

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro